<template>
  <div>
    <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" >
      <el-form-item label="型号或名称" prop="name">
        <el-input v-model="queryParams.name" placeholder="请输入仪器型号或名称" clearable size="small"
          @keyup.enter.native="handleQuery" />
      </el-form-item>
      <el-form-item label="大型设备" prop="isLargeScale">
        <el-select v-model="queryParams.isLargeScale" placeholder="请选择" clearable size="small">
          <el-option v-for="dict in isLargeScaleOptions" :key="dict.dictValue" :label="dict.dictLabel"
            :value="dict.dictValue" />
        </el-select>
      </el-form-item>
      <el-form-item label="仪器状态" prop="instrumentationStatusOpt">
        <el-select v-model="queryParams.instrumentationStatusOpt" placeholder="请选择仪器状态" clearable size="small">
          <el-option v-for="dict in instrumentationStatusOptOptions" :key="dict.dictValue" :label="dict.dictLabel"
            :value="dict.dictValue" />
        </el-select>
      </el-form-item>
      <el-form-item>
        <el-button type="cyan" icon="el-icon-search" @click="handleQuery" size="small" v-hasPermi="['labbase:instrumentation:query']">搜索</el-button>
        <el-button icon="el-icon-refresh" @click="resetQuery" size="small">重置</el-button>
      </el-form-item>
    </el-form>
    <el-row>
        <el-button icon="el-icon-plus" @click="handleAdd" size="small" v-hasPermi="['labbase:instrumentation:edit']" type="primary">
          新增仪器</el-button>
        <el-button icon="el-icon-export"  @click="handleExport">导出仪器设备</el-button>
    </el-row>
    <el-table v-loading="loading" :data="instrumentationList" @selection-change="handleSelectionChange">
      <el-table-column label="编号" prop="assetNo"  width="100"/>
      <el-table-column label="名称" prop="name" :show-overflow-tooltip="true" width="160"/>
      <el-table-column label="型号" prop="model" width="120" />
      <el-table-column label="数量" prop="quantity" width="60" align="center"/>
      <el-table-column label="大型" prop="isLargeScale" :formatter="isLargeScaleFormat" align="center" width="60"/>
      <el-table-column label="状态" prop="instrumentationStatusOpt" :formatter="instrumentationStatusOptFormat" align="center" width="60"/>
      <el-table-column label="实验室" prop="labName" :show-overflow-tooltip="true" />
      <el-table-column label="操作" width="320" align="center" class-name="small-padding fixed-width">
        <template slot-scope="scope">
          <el-button size="mini" type="text" icon="el-icon-edit" @click="handleView(scope.row)"
          v-hasPermi="['labbase:instrumentation:query']">查看</el-button>
          <el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)"
            v-hasPermi="['labbase:instrumentation:edit']">修改</el-button>
          <el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)"
            v-hasPermi="['labbase:instrumentation:edit']">删除</el-button>
          <el-button size="mini" type="text" icon="el-icon-truck" @click="handleShift(scope.row)"
          v-hasPermi="['labdata:instrumentShift:edit']">迁移</el-button>
          <el-button size="mini" type="text" icon="el-icon-time" @click="handleScrap(scope.row)"
          v-hasPermi="['labdata:scrap:edit']">报废</el-button>
          <el-button size="mini" type="text" icon="el-icon-time" @click="handleServiceStatistics(scope.row)">服务统计</el-button>
        </template>
      </el-table-column>
    </el-table>

    <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize"
      @pagination="getList" />

    <!-- 添加或修改仪器对话框 -->
    <el-dialog :title="title" :visible.sync="open" width="800px" append-to-body>
      <el-form ref="form" :model="form" :rules="rules" label-width="120px">
        <el-row>
          <el-col :span="12">
            <el-form-item label="仪器名称" prop="name">
              <el-input v-model="form.name" placeholder="请输入仪器名称" size="small" class="input_dialog_w" />
            </el-form-item>
            <el-form-item label="仪器型号" prop="model">
              <el-input v-model="form.model" placeholder="请输入仪器型号" size="small" class="input_dialog_w" />
            </el-form-item>
            <el-form-item label="仪器规格" prop="spec">
              <el-input v-model="form.spec" placeholder="请输入仪器规格" size="small" class="input_dialog_w" />
            </el-form-item>
            <el-form-item label="资产编号" prop="assetNo">
              <el-input v-model="form.assetNo" placeholder="请输入资产编号" size="small" class="input_dialog_w" />
            </el-form-item>
            <el-form-item label="资产分类名称" prop="assetNameOpt">
              <treeselect v-model="form.assetNameOpt" :options="assetNameOptOptions" :default-expand-level="2"
               placeholder="请输入资产分类"
                size="small"  :normalizer="normalizer" class="input_dialog_w"/>
            </el-form-item>
            <el-form-item label="放置地点" prop="classRoomId">
              <el-input v-model="form.classRoomId" placeholder="请输入放置地点" size="small" class="input_dialog_w" />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <UploadCom ref="upload" @submitData="submitData" isImage :userFileList="fileList" />
          </el-col>
        </el-row>
        <hr/>
        <el-row>
          <el-col :span="12">
            <el-form-item label="大型设备" prop="isLargeScale">
              <el-select v-model="form.isLargeScale" placeholder="请选择是否大型设备" size="small" class="input_dialog_w">
                <el-option v-for="dict in isLargeScaleOptions" :key="dict.dictValue" :label="dict.dictLabel"
                  :value="parseInt(dict.dictValue)"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="联系工号" prop="contactNo">
              <el-input v-model="form.contactNo" placeholder="请输入工号" type="string" size="small" class="input_dialog_w"
                @blur="searchUser" @keyup.enter.native="searchUser" />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="联系人姓名" prop="contactName">
              <el-input v-model="form.contactName" placeholder="自动填写" disabled size="small" class="input_dialog_w" />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="联系人手机号" prop="contactMobile">
              <el-input v-model="form.contactMobile" placeholder="自动填写" disabled size="small" class="input_dialog_w" />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="制造商名称" prop="manufacturer">
              <el-input v-model="form.manufacturer" placeholder="请输入制造商名称" size="small" class="input_dialog_w" />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="国别" prop="madenInCountry">
              <el-input v-model="form.madenInCountry" placeholder="请输入国别" size="small" class="input_dialog_w" />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="生产地址" prop="productionAddress">
              <el-input v-model="form.productionAddress" placeholder="请输入生产地址" size="small"  class="input_dialog_w" />
            </el-form-item>
          </el-col>
          <el-col :span="12">

          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="建账日期" prop="setUpAccount">
              <el-date-picker clearable style="width:240px" size="small" v-model="form.setUpAccount" type="date"
                value-format="yyyy-MM-dd" placeholder="选择建账日期">
              </el-date-picker>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="原值" prop="originalValue">
              <el-input v-model="form.originalValue" placeholder="请输入原值" size="small" style="width: 200px;"/><span style="margin: left 10px;">(万元)</span>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="仪器状态" prop="instrumentationStatusOpt">
              <el-select v-model="form.instrumentationStatusOpt" placeholder="请选择仪器状态" size="small"
                class="input_dialog_w">
                <el-option v-for="dict in instrumentationStatusOptOptions" :key="dict.dictValue" :label="dict.dictLabel"
                  :value="parseInt(dict.dictValue)"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="支持外部使用" prop="isAvailableForOthers">
              <el-select v-model="form.isAvailableForOthers" placeholder="请选择是否支持外部使用" size="small"
                class="input_dialog_w">
                <el-option v-for="dict in isAvailableForOthersOptions" :key="dict.dictValue" :label="dict.dictLabel"
                  :value="parseInt(dict.dictValue)"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="不支持原因" prop="unavailableReasonOpt" v-if="form.isAvailableForOthers==0">
              <el-select v-model="form.unavailableReasonOpt" placeholder="请选择不支持外部原因" size="small"  class="input_dialog_w">
                <el-option v-for="dict in unavailableReasonOptOptions" :key="dict.dictValue" :label="dict.dictLabel"
                  :value="dict.dictValue"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="12">
          </el-col>
        </el-row>
        <div v-if="form.isLargeScale==1">
        <el-row>
          <el-col :span="12">
            <el-form-item label="资源载体类型" prop="belongResourceName">
              <el-input v-model="form.belongResourceName" placeholder="请输入所属资源载体类型" size="small"  class="input_dialog_w"/>
            </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="载体内部编号" prop="belongResourceCode">
                <el-input v-model="form.belongResourceCode" placeholder="请输入所属资源载体内部编号" size="small"  class="input_dialog_w"/>
              </el-form-item>
            </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
             <el-form-item label="仪器编号" prop="deviceCode">
              <el-input v-model="form.deviceCode" placeholder="请输入所在单位仪器编号" size="small"  class="input_dialog_w" />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="仪器设备类别" prop="deviceTypeOpt">
              <el-select v-model="form.deviceTypeOpt" placeholder="请选择仪器设备类别" size="small"  class="input_dialog_w">
                <el-option
                  v-for="dict in deviceTypeOptOptions"
                  :key="dict.dictValue"
                  :label="dict.dictLabel"
                  :value="dict.dictValue"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
           <el-form-item label="仪器设备来源" prop="deviceFromOpt">
            <el-select v-model="form.deviceFromOpt" placeholder="请选择仪器设备来源" size="small"  class="input_dialog_w">
              <el-option
                v-for="dict in deviceFromOptOptions"
                :key="dict.dictValue"
                :label="dict.dictLabel"
                :value="dict.dictValue"
              ></el-option>
            </el-select>
          </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="取得方式" prop="acquisitionWayOpt">
              <el-select v-model="form.acquisitionWayOpt" placeholder="请选择取得方式" size="small"  class="input_dialog_w">
                <el-option
                  v-for="dict in acquisitionWayOptOptions"
                  :key="dict.dictValue"
                  :label="dict.dictLabel"
                  :value="dict.dictValue"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="报关单上名称" prop="nameOnCustoms">
              <el-input v-model="form.nameOnCustoms" placeholder="请输入仪器设备在进口报关单上名称" size="small"  class="input_dialog_w" />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="海关监管年限内" prop="isCustomsExpiration">
              <el-select v-model="form.isCustomsExpiration" placeholder="请选择是否在海关监管年限内" size="small"  class="input_dialog_w">
                <el-option
                  v-for="dict in isCustomsExpirationOptions"
                  :key="dict.dictValue"
                  :label="dict.dictLabel"
                  :value="parseInt(dict.dictValue)"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="进口报关单编号" prop="impDeclarationCode">
              <el-input v-model="form.impDeclarationCode" placeholder="请输入进口报关单编号" size="small"  class="input_dialog_w"/>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="进口报关单项号" prop="impDeclarationItemno">
              <el-input v-model="form.impDeclarationItemno" placeholder="请输入进口报关单项号" size="small"  class="input_dialog_w"/>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="海关放行日期" prop="customsReleaseDate">
              <el-date-picker clearable size="small" style="width: 240px"
                v-model="form.customsReleaseDate"
                type="date"
                value-format="yyyy-MM-dd"
                placeholder="选择海关放行日期">
              </el-date-picker>
            </el-form-item>
          </el-col>
          <el-col :span="12">

          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="是否处置" prop="isDisposal">
              <el-select v-model="form.isDisposal" placeholder="请选择是否处置" size="small"  class="input_dialog_w">
                <el-option
                  v-for="dict in isDisposalOptions"
                  :key="dict.dictValue"
                  :label="dict.dictLabel"
                  :value="parseInt(dict.dictValue)"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="处置时间" prop="disposalDate">
              <el-date-picker clearable size="small" style="width: 240px"
                v-model="form.disposalDate"
                type="date"
                value-format="yyyy-MM-dd"
                placeholder="选择处置时间">
              </el-date-picker>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="处置方式" prop="disposalWay">
              <el-input v-model="form.disposalWay" placeholder="请输入处置方式"  size="small"  class="input_dialog_w"/>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="处置后继续使用" prop="usingAfterDisposalOpt">
              <el-select v-model="form.usingAfterDisposalOpt" placeholder="请选择处置后是否继续使用" size="small"  class="input_dialog_w">
                <el-option
                  v-for="dict in usingAfterDisposalOptOptions"
                  :key="dict.dictValue"
                  :label="dict.dictLabel"
                  :value="parseInt(dict.dictValue)"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="价值类型" prop="valueTypeOpt">
              <el-select v-model="form.valueTypeOpt" placeholder="请选择价值类型" size="small"  class="input_dialog_w">
                <el-option
                  v-for="dict in valueTypeOptOptions"
                  :key="dict.dictValue"
                  :label="dict.dictLabel"
                  :value="dict.dictValue"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="购置经费来源" prop="acquisitionsFunding">
              <el-input v-model="form.acquisitionsFunding" placeholder="请输入主要购置经费来源" size="small"  class="input_dialog_w"/>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="财政性拨款" prop="financialAppropriations">
              <el-input v-model="form.financialAppropriations" placeholder="请输入财政性拨款" size="small"  class="input_dialog_w" />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="非财政性拨款" prop="notFinancialAppropriations">
              <el-input v-model="form.notFinancialAppropriations" placeholder="请输入非财政性拨款" size="small"  class="input_dialog_w" />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="主要科学领域" prop="majorAreasScience">
              <el-input v-model="form.majorAreasScience" placeholder="请输入主要科学领域" size="small"  class="input_dialog_w" />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="应用技术领域" prop="applicationTechnology">
              <el-input v-model="form.applicationTechnology" placeholder="请输入应用技术领域" size="small"  class="input_dialog_w" />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
           <el-form-item label="用户须知" prop="userNotes">
             <el-input v-model="form.userNotes" placeholder="请输入用户须知" size="small"  class="input_dialog_w" />
           </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="服务内容" prop="serviceContent">
              <el-input v-model="form.serviceContent" placeholder="请输入服务内容" size="small"  class="input_dialog_w" />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">

          </el-col>
          <el-col :span="12">
            <el-form-item label="纳入服务平台" prop="isOnlineServiceOpt">
              <el-select v-model="form.isOnlineServiceOpt" placeholder="请选择是否纳入在线服务平台" size="small"  class="input_dialog_w">
                <el-option
                  v-for="dict in isOnlineServiceOptOptions"
                  :key="dict.dictValue"
                  :label="dict.dictLabel"
                  :value="parseInt(dict.dictValue)"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="参考收费标准" prop="referFee">
              <el-input v-model="form.referFee" placeholder="请输入参考收费标准" size="small"  class="input_dialog_w" />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="预约服务网址" prop="reservationUrl">
              <el-input v-model="form.reservationUrl" placeholder="请输入预约服务网址" size="small"  class="input_dialog_w" />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="电子邮箱" prop="contactEmail">
              <el-input v-model="form.contactEmail" placeholder="请输入电子邮箱" size="small"  class="input_dialog_w" />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="通讯地址" prop="correspondenceAddress">
              <el-input v-model="form.correspondenceAddress" placeholder="请输入通讯地址" size="small"  class="input_dialog_w" />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="使用状况" prop="usingOpt">
              <el-select v-model="form.usingOpt" placeholder="请选择使用状况" size="small"  class="input_dialog_w">
                <el-option
                  v-for="dict in usingOptOptions"
                  :key="dict.dictValue"
                  :label="dict.dictLabel"
                  :value="dict.dictValue"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="使用人" prop="usingPeople">
              <el-input v-model="form.usingPeople" placeholder="请输入使用人" size="small"  class="input_dialog_w"/>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="使用部门" prop="usingDepartment">
              <el-input v-model="form.usingDepartment" placeholder="请输入使用部门" size="small"  class="input_dialog_w" />
            </el-form-item>
          </el-col>
          <el-col :span="12">
          <el-form-item label="是否集约化管理" prop="isIntensiveManageOpt">
            <el-select v-model="form.isIntensiveManageOpt" placeholder="请选择是否集约化管理" size="small"  class="input_dialog_w">
              <el-option
                v-for="dict in isIntensiveManageOptOptions"
                :key="dict.dictValue"
                :label="dict.dictLabel"
                :value="parseInt(dict.dictValue)"
              ></el-option>
            </el-select>
          </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="是否公示" prop="isShowPublicOpt">
              <el-select v-model="form.isShowPublicOpt" placeholder="请选择是否公示" size="small"  class="input_dialog_w">
                <el-option
                  v-for="dict in isShowPublicOptOptions"
                  :key="dict.dictValue"
                  :label="dict.dictLabel"
                  :value="parseInt(dict.dictValue)"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="是否资源调查" prop="isSurveyOpt">
              <el-select v-model="form.isSurveyOpt" placeholder="请选择是否资源调查" size="small"  class="input_dialog_w">
                <el-option
                  v-for="dict in isSurveyOptOptions"
                  :key="dict.dictValue"
                  :label="dict.dictLabel"
                  :value="parseInt(dict.dictValue)"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="管理单位名称" prop="managementFullName">
              <el-input v-model="form.managementFullName" placeholder="请输入管理单位名称" size="small"  class="input_dialog_w" />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="审核状态" prop="approvalStatus">
                <el-input v-model="form.approvalStatus" placeholder="请输入审核状态" size="small"  class="input_dialog_w" />
              </el-form-item>
          </el-col>
        </el-row>
        </div>
        <hr />
        <el-row>
          <el-col :span="12">
            <el-form-item label="设备分类(一级)" prop="bigCategoryOpt">
             <el-select v-model="form.bigCategoryOpt"  size="small"
                class="input_dialog_w">
                <el-option v-for="dict in bigCategoryOptOptions" :key="dict.dictValue" :label="dict.dictLabel"
                  :value="parseInt(dict.dictValue)"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="设备分类(二级)" prop="smallCategoryOpt">
              <el-select v-model="form.smallCategoryOpt"  size="small"
                class="input_dialog_w">
                <el-option v-for="dict in smallCategoryOptOptions" :key="dict.dictValue" :label="dict.dictLabel"
                  :value="parseInt(dict.dictValue)"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="设备分类(三级)" prop="thirdCategoryOpt">
              <el-select v-model="form.thirdCategoryOpt" placeholder="请选择设备分类" size="small"  class="input_dialog_w">
                <el-option
                  v-for="dict in thirdCategoryOptOptions"
                  :key="dict.dictValue"
                  :label="dict.dictLabel"
                  :value="dict.dictValue"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row style="width:740px">
          <el-form-item label="介绍">
            <editor v-model="form.profileInfo" :min-height="120" />
          </el-form-item>
          <el-form-item label="技术介绍">
            <editor v-model="form.technologyInfo" :min-height="120" />
          </el-form-item>
          <el-form-item label="主要功能介绍">
            <editor v-model="form.mainFunction" :min-height="120" />
          </el-form-item>
          <el-form-item label="备注说明">
            <editor v-model="form.comments" :min-height="120" />
          </el-form-item>
        </el-row>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitForm"  v-hasPermi="['labbase:instrumentation:edit']">确 定</el-button>
        <el-button @click="cancel">取 消</el-button>
      </div>
    </el-dialog>
    <InstrumentShift @reload="getList" ref="shiftCom" />
    <Scrap @reload="getList" ref="scrapCom" />
    <InstruDetails ref="details"/></InstruDetails>
  </div>
</template>

<script>
  import {
    listInstrumentation,
    getInstrumentation,
    delInstrumentation,
    addInstrumentation,
    updateInstrumentation,
    exportInstrumentation,
  } from "@/api/labbase/instrumentation";
  import {
    searchLabInfo,
    getThirdLab
  } from "@/api/labdata/orgnization";
  import {
    searchEmployee
  } from "@/api/labdata/employee"
  import Editor from '@/components/Editor';
  import InstrumentShift from "@/views/labdata/instrumentShift";
  import Scrap from "@/views/labdata/scrap";
  import UploadCom from "@/views/labdata/commons/upload.vue";
  import InstruDetails from "@/views/labbase/instrumentation/details.vue";
  import {
    treeselect
  } from "@/api/labdata/orgnization";
  import Treeselect from "@riophae/vue-treeselect";
  import "@riophae/vue-treeselect/dist/vue-treeselect.css";
  export default {
    name: "Instrumentation",
    components: {
      Editor,
      InstrumentShift,
      Scrap,
      UploadCom,
      InstruDetails,
      Treeselect
    },
    data() {
      return {
        host: process.env.VUE_APP_PROXY,
        searchUserInfos: [],
        thirdLabList: [],
        allInfos: [],
        fileList: [],
        // 遮罩层
        loading: true,
        // 选中数组
        ids: [],
        // 非单个禁用
        single: true,
        // 非多个禁用
        multiple: true,
        // 显示搜索条件
        showSearch: true,
        // 总条数
        total: 0,
        // 仪器表格数据
        instrumentationList: [],
        // 弹出层标题
        title: "",
        // 是否显示弹出层
        open: false,
        // 部门树选项
        deptOptions: [],
        // 是否大型设备字典
        isLargeScaleOptions: [],
        // 仪器状态字典
        instrumentationStatusOptOptions: [],
        // 是否提供给外部使用字典
        isAvailableForOthersOptions: [],
        // 特种设备字典
        specialEquipmentOptOptions: [],
        // 不提供给外部原因字典
        unavailableReasonOptOptions: [],
        // 是否贵重设备字典
        isValuableOptions: [],
        // 资产分类名称字典
        assetNameOptOptions: [],
        // 大类名称字典
        bigCategoryOptOptions: [],
        // 小类名称字典
        smallCategoryOptOptions: [],
        // 仪器设备类别字典
        deviceTypeOptOptions: [],
        // 仪器设备来源字典
        deviceFromOptOptions: [],
        // 取得方式字典
        acquisitionWayOptOptions: [],
        // 设备分类字典
        thirdCategoryOptOptions: [],
        // 是否在海关监管年限内字典
        isCustomsExpirationOptions: [],
        // 是否处置字典
        isDisposalOptions: [],
        // 处置后是否继续使用字典
        usingAfterDisposalOptOptions: [],
        // 价值类型字典
        valueTypeOptOptions: [],
        // 是否纳入在线服务平台字典
        isOnlineServiceOptOptions: [],
        // 使用状况字典
        usingOptOptions: [],
        // 是否集约化管理字典
        isIntensiveManageOptOptions: [],
        // 是否公示字典
        isShowPublicOptOptions: [],
        // 是否资源调查字典
        isSurveyOptOptions: [],
        // 查询参数
        queryParams: {
          pageNum: 1,
          pageSize: 10,
          labId: null,
          model: null,
          name: null,
          isLargeScale: null,
          instrumentationStatusOpt: null,
          isValuable: null,
        },
        // 表单参数
        form: {},
        defaultProps: {
          children: "children",
          label: "label"
        },
        // 表单校验
        rules: {
          labId: [{
            required: true,
            message: "所在机构不能为空",
            trigger: "blur"
          }],
          model: [{
            required: true,
            message: "仪器型号不能为空",
            trigger: "blur"
          }],
          name: [{
            required: true,
            message: "仪器名称不能为空",
            trigger: "blur"
          }],
          assetNo: [{
            required: true,
            message: "资产编号不能为空",
            trigger: "blur"
          }],
          classRoomId: [{
            required: true,
            message: "放置地点不能为空",
            trigger: "blur"
          }],
          bigCategoryOpt: [{
            required: true,
            message: "仪器大类不能为空",
            trigger: "blur"
          }],
          smallCategoryOpt: [{
            required: true,
            message: "仪器小类不能为空",
            trigger: "blur"
          }],
         /* madenInCountry: [{
            required: true,
            message: "国别不能为空",
            trigger: "blur"
          }], */
          instrumentationStatusOpt: [{
            required: true,
            message: "仪器状态不能为空",
            trigger: "change"
          }],
        }
      };
    },
    props: {
      orgId: Number,
    },
    watch: {
      orgId(val) {
        this.queryParams.labId = val;
        this.getList();
      },
    },
    created() {
      //this.getTreeselect();
      this.queryParams.labId = this.$props.orgId;
      //console.log('devServer.env:'+process.env.VUE_APP_PROXY);
      this.getList();
      this.getDicts("isOrNotOpt").then(response => {
        this.isLargeScaleOptions = response.data;
        this.isAvailableForOthersOptions = response.data;
        this.specialEquipmentOptOptions = response.data;
        this.isValuableOptions = response.data;
        this.isDisposalOptions = response.data;
        this.isCustomsExpirationOptions = response.data;
        this.usingAfterDisposalOptOptions = response.data;
        this.isOnlineServiceOptOptions = response.data;
        this.isIntensiveManageOptOptions = response.data;
        this.isShowPublicOptOptions = response.data;
        this.isSurveyOptOptions = response.data;
      });
      this.getDicts("device_type_opt").then(response => {
        this.deviceTypeOptOptions = response.data;
      });
      this.getDicts("device_from_opt").then(response => {
        this.deviceFromOptOptions = response.data;
      });
      this.getDicts("acquisition_way_opt").then(response => {
        this.acquisitionWayOptOptions = response.data;
      });
      this.getDicts("third_category_opt").then(response => {
        this.thirdCategoryOptOptions = response.data;
      });
      this.getDicts("value_type_opt").then(response => {
        this.valueTypeOptOptions = response.data;
      });
      this.getDicts("using_opt").then(response => {
        this.usingOptOptions = response.data;
      });
      this.getDicts("instrumentationStatusOpt").then(response => {
        this.instrumentationStatusOptOptions = response.data;
      });

      this.getDicts("unavailableReasonOpt").then(response => {
        this.unavailableReasonOptOptions = response.data;
      });

      this.getDicts("assetNameOpt").then(response => {
        this.assetNameOptOptions = response.data;
      });
      this.getDicts("bigCategoryOpt").then(response => {
        this.bigCategoryOptOptions = response.data;
      });
      this.getDicts("smallCategoryOpt").then(response => {
        this.smallCategoryOptOptions = response.data;
      });
      getThirdLab().then(response => {
        this.thirdLabList = response.data;
      });
    },
    methods: {
      handleView(row){
        this.$refs["details"].viewData(row.instrumentationId);
      },
      handleShift(row) {
        this.$refs["shiftCom"].handleAdd(row);
      }, //scrapCom
      handleScrap(row) {
        this.$refs["scrapCom"].handleAdd(row.instrumentationId, row.name);
      },
      // 对外服务统计 这种传参方式页面刷新参数丢失
      // handleServiceStatistics(row) {
      //  this.$router.push({path:'/labdata/instrumentationForeignService',query: {
      //    instrumentationId:row.instrumentationId,
      //    instrumentationName:row.name
      //   }})
      // },
      handleServiceStatistics(row) {
       this.$router.push({path:`/labdata/instrumentationForeignService/${row.name}/${row.instrumentationId}`,
    })
      },
      searchUser() {
        if (!this.form.contactNo) {
          this.form.userName = null;
          this.form.contactMobile = null;
          this.form.contactId = null;
          return;
        } else
          searchEmployee(this.form.contactNo).then(response => {
            let searchResult = response.data;
            if (searchResult) {
              this.form.contactName = searchResult.nickName;
              this.form.contactMobile = searchResult.phonenumber;
              this.form.contactId = searchResult.employeeId;
              //console.log('employee name:' + this.form.contactName);
            } else {
              this.form.contactName = null;
              this.form.contactMobile = null;
              this.form.contactId = null;
            }
            this.$forceUpdate();
          });

      },
      querySearchUser(queryString, cb) {
        searchEmployee(queryString).then(response => {
          this.searchUserInfos = response.data;
          let results = this.searchUserInfos.map((item) => {
            return {
              value: item.employeeNo,
              name: item.employeeId,
            };
          });
          cb(results);
        });
      },
      handleChooseUser(item) {
        this.changeStyle("none", ".el-autocomplete-suggestion");
        this.form.contactId = item.name;
        //console.log('user id:' + JSON.stringify(item));
        for (let i = 0; i < this.searchUserInfos.length; i++) {
          if (this.searchUserInfos[i].employeeId == item.name) {
            this.form.userName = this.searchUserInfos[i].employeeName;
            this.form.contactMobile = this.searchUserInfos[i].phonenumber;
            //console.log('choosed user:' + this.form.userName);
            break;
          }
        }
      },
      handleLabChange() {
        //console.log('change lab :'+item);
         console.log('thirdLabList length='+this.thirdLabList.length);
        for (let i = 0; i < this.thirdLabList.length; i++) {
          if (this.thirdLabList[i].orgId == this.form.labId) {
            this.form.superOrgId = this.thirdLabList[i].parentId;
            this.form.superName = this.thirdLabList[i].parentName;
            this.form.labName = this.thirdLabList[i].orgName;
            console.log('parent name='+this.form.labName);
            break;
          }
        }
        this.$forceUpdate();
      },
      /** 查询部门下拉树结构 */
      getTreeselect() {
        treeselect().then(response => {
          this.deptOptions = response.data;
        });
      },
      //searchUserInfos
      //根据传进来的状态改变建议输入框的状态（展开|隐藏）
      changeStyle(status, className) {
        let dom = document.querySelectorAll(className);
        dom[0].style.display = status;
      },
      /** 查询仪器列表 */
      getList() {
        this.loading = true;
        //console.log('labId=' + this.queryParams.labId);
        listInstrumentation(this.queryParams).then(response => {
          this.instrumentationList = response.rows;
          this.total = response.total;
          this.loading = false;
        });
      },
      // 是否大型设备字典翻译
      isLargeScaleFormat(row, column) {
        return this.selectDictLabel(this.isLargeScaleOptions, row.isLargeScale);
      },
      // 仪器状态字典翻译
      instrumentationStatusOptFormat(row, column) {
        return this.selectDictLabel(this.instrumentationStatusOptOptions, row.instrumentationStatusOpt);
      },
      // 是否提供给外部使用字典翻译
      isAvailableForOthersFormat(row, column) {
        return this.selectDictLabel(this.isAvailableForOthersOptions, row.isAvailableForOthers);
      },
      // 特种设备字典翻译
      specialEquipmentOptFormat(row, column) {
        return this.selectDictLabel(this.specialEquipmentOptOptions, row.specialEquipmentOpt);
      },
      // 不提供给外部原因字典翻译
      unavailableReasonOptFormat(row, column) {
        return this.selectDictLabel(this.unavailableReasonOptOptions, row.unavailableReasonOpt);
      },
      // 是否贵重设备字典翻译
      isValuableFormat(row, column) {
        return this.selectDictLabel(this.isValuableOptions, row.isValuable);
      },
      // 资产分类名称字典翻译
      assetNameOptFormat(row, column) {
        return this.selectDictLabel(this.assetNameOptOptions, row.assetNameOpt);
      },
      // 仪器设备类别字典翻译
      deviceTypeOptFormat(row, column) {
        return this.selectDictLabel(this.deviceTypeOptOptions, row.deviceTypeOpt);
      },
      // 设备分类字典翻译
      thirdCategoryOptFormat(row, column) {
        return this.selectDictLabel(this.thirdCategoryOptOptions, row.thirdCategoryOpt);
      },
      // 是否在海关监管年限内字典翻译
      isCustomsExpirationFormat(row, column) {
        return this.selectDictLabel(this.isCustomsExpirationOptions, row.isCustomsExpiration);
      },
      // 是否处置字典翻译
      isDisposalFormat(row, column) {
        return this.selectDictLabel(this.isDisposalOptions, row.isDisposal);
      },
      // 处置后是否继续使用字典翻译
      usingAfterDisposalOptFormat(row, column) {
        return this.selectDictLabel(this.usingAfterDisposalOptOptions, row.usingAfterDisposalOpt);
      },
      // 价值类型字典翻译
      valueTypeOptFormat(row, column) {
        return this.selectDictLabel(this.valueTypeOptOptions, row.valueTypeOpt);
      },
      // 是否纳入在线服务平台字典翻译
      isOnlineServiceOptFormat(row, column) {
        return this.selectDictLabel(this.isOnlineServiceOptOptions, row.isOnlineServiceOpt);
      },
      // 使用状况字典翻译
      usingOptFormat(row, column) {
        return this.selectDictLabel(this.usingOptOptions, row.usingOpt);
      },
      // 是否集约化管理字典翻译
      isIntensiveManageOptFormat(row, column) {
        return this.selectDictLabel(this.isIntensiveManageOptOptions, row.isIntensiveManageOpt);
      },
      // 是否公示字典翻译
      isShowPublicOptFormat(row, column) {
        return this.selectDictLabel(this.isShowPublicOptOptions, row.isShowPublicOpt);
      },
      // 是否资源调查字典翻译
      isSurveyOptFormat(row, column) {
        return this.selectDictLabel(this.isSurveyOptOptions, row.isSurveyOpt);
      },
      normalizer(node) {
        if (node.children && !node.children.length) {
          delete node.children;
        }
        return {
          id: node.dictValue,
          label: node.dictLabel,
          children: node.children
        };
      },
      // 取消按钮
      cancel() {
        this.open = false;
        this.reset();
      },
      // 表单重置
      reset() {
        this.form = {};
        this.fileList = [];
        this.searchUserInfos = [];
        this.allInfos = [];
        this.resetForm("form");
      },
      /** 搜索按钮操作 */
      handleQuery() {
        this.queryParams.pageNum = 1;
        this.getList();
      },
      /** 重置按钮操作 */
      resetQuery() {
        this.resetForm("queryForm");
        this.handleQuery();
      },
      // 多选框选中数据
      handleSelectionChange(selection) {
        this.ids = selection.map(item => item.instrumentationId)
        this.single = selection.length !== 1
        this.multiple = !selection.length
      },
      /** 新增按钮操作 */
      handleAdd() {
        this.reset();
        this.form.labId = this.queryParams.labId;
        this.open = true;
        this.title = "添加仪器";
      },
      /** 修改按钮操作 */
      handleUpdate(row) {
        this.reset();
        const instrumentationId = row.instrumentationId || this.ids
        getInstrumentation(instrumentationId).then(response => {
          this.form = response.data;
          if (this.form) {
            this.fileList = this.form.images;
          }
          this.open = true;
          this.searchUser();
          this.title = "修改仪器";
        });
      },
      /** 提交按钮 */
      submitForm() {
        this.$refs["form"].validate(valid => {
          if (valid) {
            this.$refs["upload"].doSubmit();
          }
        });
      },
      submitData(fileList) {
        this.form.images = fileList;
        //console.log('imagesList:' + JSON.stringify(fileList));
        if (this.form.instrumentationId != null) {
          updateInstrumentation(this.form).then(response => {
            this.msgSuccess("修改成功");
            this.open = false;
            this.getList();
          });
        } else {
          addInstrumentation(this.form).then(response => {
            this.msgSuccess("新增成功");
            this.open = false;
            this.getList();
          });
        }
      },

      /** 删除按钮操作 */
      handleDelete(row) {
        const instrumentationIds = row.instrumentationId || this.ids;
        this.$confirm('是否确认删除仪器编号为"' + instrumentationIds + '"的数据项?', "警告", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        }).then(function() {
          return delInstrumentation(instrumentationIds);
        }).then(() => {
          this.getList();
          this.msgSuccess("删除成功");
        })
      },
      /** 导出按钮操作 */
      handleExport() {
        const queryParams = this.queryParams;
        this.$confirm('是否确认导出所有仪器数据项?', "警告", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        }).then(function() {
          return exportInstrumentation(queryParams);
        }).then(response => {
          this.download(response.msg);
        })
      }
    }
  };
</script>
<style type="text/css" lang="scss" scoped>
  .input_dialog_w {
    width: 240px;
  }
  .el-form-item {
      margin-bottom: 16px;
  }
</style>
